<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes"/>
    <script src="jquery/jquery.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $.post("indexFilelist",
                    function (data) {
                        if ('' == data) {
                            alert("当前没有视频文件！")
                            return;
                        }
                        var json = JSON.parse(data);
                        var str = "";
                        for (var i = 0; i < json.length; i++) {
                            var obj = json[i];
                            str = str + "<label id=" + obj.id + " title=" + obj.fileDownloadUrl + "><input  type='radio' name='movie' value=" + obj.id + " class=" + obj.openId + " />" + obj.name + "</label><br>";
                        }
                        document.getElementById("indexFilelist").innerHTML = str;
                    });
        });


        function play() {
            var fileId = $("input[name='movie']:checked").val();
            if (null == fileId) {
                alert("请先勾选一项！")
                return;
            }
            var fileName = $("label#" + fileId).text();
            var fileDownloadUrl = document.getElementById(fileId).title;
            var playUrl = "play?loginStatus=0&fileName=" + fileName + "&fileDownloadUrl=" + encodeURIComponent(fileDownloadUrl);
            $.get(playUrl,
                    function (data) {
                        if ("success" == data) {
                            alert("即将播放！")
                        } else {
                            alert(data)
                        }
                    });
        }

        function collect() {
            var fileId = $("input[name='movie']:checked").val();
            if (null == fileId) {
                alert("请先勾选一项！")
                return;
            }
            var openId = $("input[name='movie']:checked").attr("class");
            $.post("collectFile?fileId=" + fileId + "&producerOpenId=" + openId,
                    function (data) {
                        if ("success" == data) {
                            alert("收藏成功！")
                        } else {
                            alert(data)
                        }
                    });
        }
    </script>

</head>
<body style="background:url(img/welcome.jpg); height:665px; width:375px;">
<div id="list1" style="text-align: center">


    <div style=" line-height:42px ;font-size: 20px " id="indexFilelist">
    </div>

    <div id="bottom" style="margin-top:80px;margin-left: 20px">

        <button type="button" onclick="play()" value="ssss">投屏</button>

        <button type="button" onclick="collect()">收藏</button>

    </div>
</div>
<div id="myDiv" style="color: red;text-align: center; margin-left: 20px;margin-top:60px">授权登录天翼云盘
    <button id="b01" type="button">我的云盘入口</button>
</div>

</body>
<script>

    $(document).ready(function () {
        $("#b01").click(function () {
            $.get("login",
                    function (data) {
                        if ("success" == data) {
                            window.location.href = "myDisk.html";
                            return;
                        }
                        document.getElementById("b01").style.display = "none";
                        document.getElementById("list1").style.display = "none";
                        $("#myDiv").html(data);
                    });
        });

    });
</script>
</html>